/**
 * Product Details
 */


/* Product Details Left */
.product-details-images, .product-details-thumbs{
    &.slider-navigation-2{
        .slider-navigation{
            top: 50%;
            margin-top: -10px;
            &.slider-navigation-prev{
                left: 0;
                right: auto;
            }
            &.slider-navigation-next{
                left: auto;
                right: 0;
            }
        }
    }
}

.product-details-images{
    a{
        img{
            width: 100%;
        }
    }
}

.product-details-thumbs{
    margin-top: 10px;
    overflow: hidden;
    .slick-list{
        margin-left: -7.5px;
        margin-right: -7.5px;
    }
    .slick-slide{
        margin: 0 7.5px;
        cursor: pointer;
        div{
            border: 1px solid transparent;
            transition: all 0.3s ease-in-out 0s;
        }
        &.slick-center{
            div{
                border-color: $theme-color;
            }
        }
    }
}



/* Product Details Left 2 */
.product-details-left-2{
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;

    .product-details-images{
        flex: 0 0 430px;
        max-width: 430px;
    }
    .product-details-thumbs{
        margin-top: 0;
        flex: 0 0 130px;
        max-width: 130px;

        .slick-slide{
            margin-bottom: 10px;
            & > div{
                border: 0 !important;
            }
        }
    }

    @media #{$lg-layout}{
        .product-details-images{
            flex: 0 0 340px;
            max-width: 340px;
        }
        .product-details-thumbs{
            flex: 0 0 100px;
            max-width: 100px;
        }
    }

    @media #{$md-layout}{
        display: block;

        .product-details-images{
            flex: inherit;
            max-width: 100%;
        }
        .product-details-thumbs{
            margin-top: 10px;
            flex: inherit;
            max-width: 100%;
        }
    }

    @media #{$sm-layout}{
        .product-details-images{
            flex: 0 0 382px;
            max-width: 382px;
        }
        .product-details-thumbs{
            flex: 0 0 115px;
            max-width: 115px;
        }
    }

    @media #{$xs-layout}{
        display: block;

        .product-details-images{
            flex: inherit;
            max-width: 100%;
        }
        .product-details-thumbs{
            margin-top: 10px;
            flex: inherit;
            max-width: 100%;
        }
    }

}



/* Product Details Gallery */
.product-details-gallery{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: -10px;
    & > a{
        flex: 0 0 calc(50% - 5px);
        margin-top: 10px;
    }
}





/* Product Details Right */
.product-details-right{
    @include clearfix();
    p{
        margin-top: 20px;    
    }
    
    .product-title{
        font-family: $body-font;
        font-weight: 600;
        margin-bottom: 5px;
        font-size: 24px;        
    }

    .ratting-stock-availbility{
        .ratting-box{
            display: inline-block;
        }
        .stock-available{
            color: #77a464;
            display: inline-block;
            font-size: 12px;
            margin-left: 10px;
        }
    }

    .pricebox{
        margin-top: 40px;
        display: block;
        font-size: 20px;
        font-weight: 700;
        del{
            font-size: 16px;
            color: #666666;
        }
    }

}

.product-details-quantity{
    margin-top: 20px;
    margin-bottom: 20px;
    margin-top: 20px;
    margin-bottom: 30px;
    .sf-button{
        margin-left: 10px;
    }
}

.quantity-select{
    display: inline-block;
    position: relative;
    max-width: 110px;
    vertical-align: middle;
    input{
        text-align: center;
        padding: 0 15px;
        height: 44px;
        vertical-align: top;
    }
    .qtybutton{
        position: absolute;
        top: 50%;
        height: 25px;
        width: 25px;
        line-height: 23px;
        margin-top: -12.5px;
        text-align: center;
        font-size: 20px;
        cursor: pointer;
        border: 1px solid #e1e1e1;
        border-radius: 100px;
        text-align: center;
        &.dec{
            left: 8px;
            right: auto;
        }
        &.inc{
            right: 8px;
            left: auto;
        }
    }
}

.product-details-categories, .product-details-tags, .product-details-socialshare, .product-details-color, .product-details-size{
    border-top: 1px dashed #e5e5e5;
    padding: 12px 0;
    & > span{
        display: inline-block;
        margin-right: 20px;
    }
    ul{
        display: inline-block;
        padding-left: 0;
        margin-bottom: 0;
        li{
            list-style: none;
            display: inline-block;
            &::after{
                content: ",";
            }
            &:last-child{
                &::after{
                    display: none;
                }
            }
            a{
                color: $body-color;
                &:hover{
                    color: $theme-color;
                }
            }
        }
    }
}

.product-details-socialshare{
    ul{
        li{
            & + li{
                margin-left: 5px;
            }
            &::after{
                display: none;
            }
            a{
                display: inline-block;
                height: 30px;
                width: 30px;
                line-height: 1;
                text-align: center;
                color: $body-color;
                border: 1px solid #c5c5c5;
                border-radius: 100%;
                font-size: 14px;
                i{
                    line-height: 28px;
                }
                &:hover{
                    color: #ffffff;
                    border-color: $theme-color;
                    background: $theme-color;
                }
            }
        }
    }
}

.product-details-color, .product-details-size{
    ul{
        li{
            & + li{
                margin-left: 5px;
            }
            &::after{
                display: none;
            }
            span{
                display: inline-block;
                height: 18px;
                width: 18px;
                background: $theme-color;
                border-radius: 100px;
                vertical-align: middle;
                position: relative;
                cursor: pointer;
                border: 1px solid transparent;
                &::before{
                    content: "";
                    position: absolute;
                    left: 50%;
                    top: 50%;
                    height: calc(100% + 2px);
                    width: calc(100% + 2px);
                    transform: translate(-50%, -50%);
                    border: 1px solid rgba(#000000, 1);
                    visibility: hidden;
                    opacity: 0;
                    transition: all 0.3s ease-in-out 0s;
                    border-radius: 100px;
                }
            }
            &.checked{
                span{
                    &::before{
                        visibility: visible;
                        opacity: 1;
                    }
                }
            }
            &.red{
                span{
                    background: rgb(244, 67, 54);
                }
            }
            &.green{
                span{
                    background: rgb(76, 175, 80);
                }
            }
            &.blue{
                span{
                    background: rgb(33, 150, 243);
                }
            }
            &.purple{
                span{
                    background: rgb(103, 58, 183);
                }
            }
        }
    }
}

.product-details-size{
    ul{
        li{
            span{
                width: 26px;
                height: 26px;
                text-align: center;
                line-height: 24px;
                background: transparent;
                font-size: 10px;
                border: 1px solid #c5c5c5;
            }
        }
    }
}

@media #{$sm-layout}{
    .product-details-right {
        margin-top: 40px;
    }
}




/* Product Descripton Review */
.product-descripton-review{
    margin-top: 50px;
    ul.nav{
        padding-left: 0;
        margin-bottom: 20px;
        li{
            list-style: none;
            &::after{
                content: "//";
                padding: 0 10px 0 6px;
            }
            &:last-child{
                &::after{
                    display: none;
                }
            }
            a{
                border: 0;
                padding: 0;
                font-size: 14px;
                font-weight: 400;
                border-bottom: 1px solid transparent;
                color: $heading-color;
                display: inline-block;
                letter-spacing: 3px;
                text-transform: capitalize;
                &:hover, &.active{
                    color: $theme-color;
                }
            }
        }
    }

    .tab-content{
        border: 1px solid #d5d5d5;
        padding: 30px;
    }
}
.product-description{
    p{
        margin-bottom: 20px;
        &:last-of-type{
            margin-bottom: 0;
        }
    }
}

@media #{$xs-layout}{
    .product-descripton-review{
        .tab-content{
            padding: 20px;
        }
    }
}

